<style>
    .layui-table-cell{
        height: auto;
    }
    .layui-table-cell {

        height: auto;
        margin-top: 20px;

        line-height: 28px;
    }
</style>

<div class="layui-fluid">
    <div class="layui-row layui-col-space15">
        <div class="layui-col-md12">
            <div class="layui-row layui-col-space15">
                <div class="layui-col-md15">
                    <div class="layui-row layui-col-space15">
                        <div class="layui-col-md12">
                            <div class="layui-card">
                                <div class="layui-card-header">管理员列表</div>
                                <div class="layui-card-body">
                                    <table  style="border-collapse:separate; border-spacing:0px 10px;" id="teachTable" lay-filter="teachTable"></table>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>

            </div>
        </div>
    </div>
</div>

<div class="layui-content" id="addAdminBox" style="display: none">
    <div class="layui-card-header">新增管理员</div>
    <form class="layui-form layui-card-body" action="" lay-filter="example">

        <div class="layui-form-item">
            <label class="layui-form-label">账号：</label>
            <div class="layui-input-inline">
                <input name="account" class="layui-input" type="text" placeholder="请输入账号" autocomplete="off"
                       lay-verify="account" id="account">
            </div>
            <div class="layui-form-mid layui-word-aux" id="accountMsg">
            </div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label">密码：</label>
            <div class="layui-input-inline">
                <input name="pass" class="layui-input" type="password" placeholder="请输入密码" autocomplete="off"
                       lay-verify="pass">
            </div>
            <div class="layui-form-mid layui-word-aux" id="passMsg">请填写6到12位密码</div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label">管理权限：</label>
            <div class="layui-input-block">
                <input type="checkbox" name="platfrom" value="0" title="资源汇集与管理">
                <input type="checkbox" name="platfrom" value="1" title="云教育服务">
                <input type="checkbox" name="platfrom" value="2" title="智能分析">
                <input type="checkbox" name="platfrom" value="3" title="教师管理">
            </div>
        </div>
    </form>
    <div class="layui-row layui-col-space12">
        <div class="layui-col-md12" style="text-align: center">
            <div class="layui-card-body" id="message">

            </div>
        </div>
    </div>
    <div class="layui-form-item">
        <div class="layui-input-block" style="float: right;right: 50px">
            <a class="layui-btn layui-btn-blue" id="sumbitAdmin" onclick="addNewAdmin()">立即添加</a>
        </div>
    </div>
</div>

<script type="text/javascript" src="js/jQuery.md5.js"></script>
<script type="text/javascript" src="js/echarts.min.js"></script>
<script id="switchTpl" type="text/html">

    <?php
    session_start();
    $power = $_SESSION['power'];
    if ($power == 1) {
        echo "    {{#  if( d.power!=1){ }}
    <input type=\"checkbox\" name=\"status\" value=\"{{d.id}}\" lay-skin=\"switch\" lay-text=\"启用|禁用\" lay-filter=\"statusBox\" {{
           d.status== \"1\" ? 'checked' : '' }} >
    {{#  } }}";

    } else {

        echo "<a style=\"color: #787878\" class=\"layui-table-link\">不可操作</a>";
    }

    ?>
</script>
<script id="toolbarDemo" type="text/html">
    <div class="layui-btn-container">
        <?php
        if ($power == 1) {
      echo "  <button class=\"layui-btn layui-btn-sm layui-btn-primary\" onclick=\"addAdmin()\"><i class=\"layui-icon\">&#xe608;</i>
            新增管理员
        </button>";
        }

        ?>

        <button class="layui-btn layui-btn-sm layui-btn-normal" onclick="refresh()"><i class="layui-icon">&#xe9aa;</i>
            刷新
        </button>
    </div>
</script>
<script>
    var startInter = api.adminInter;
    var audio = "t", startTime, endTime;//初始化查询身份为教师,与当前的时间
    var arrTitle = [], edit, editId;//标题
    var rootArray = [0, 0, 0, 0];
    $(document).ready(function () {
        table();
        $("#account").bind('input propertychange', function () {
            $account = $("#account").val();
            if ($account.length < 3) {
                $html = "<i class=\"layui-icon\" style=\"color: gray\">&#x1006;</i>输入错误";
            }
            else {
                $html = "<i class=\"layui-icon\" style=\"color: green\">&#xe605;</i>输入正确";
            }
            $("#accountMsg").html($html);
        });
        $("input[name='pass']").bind('input propertychange', function () {
            $pass = $("input[name='pass']").val();
            if ($pass.length < 6) {
                $html = "<i class=\"layui-icon\" style=\"color: gray\">&#x1006;</i>输入错误";
            }
            else {
                $html = "<i class=\"layui-icon\" style=\"color: green\">&#xe605;</i>输入正确";
            }
            $("#passMsg").html($html);
        });
        layui.use(['form', 'layedit', 'laydate'], function () {
            var form = layui.form
                , layer = layui.layer
                , layedit = layui.layedit
                , laydate = layui.laydate;
            form.render();


        });
    });
    function table() {
        layui.use('table', function () {
            var table = layui.table,
                form = layui.form;

            //第一个实例
            table.render({
                elem: '#teachTable'
                , url: startInter //数据接口
                , title: '管理员列表数据'
                , page: true //开启分页
                , toolbar: "#toolbarDemo"
                , method: 'post'
                , totalRow: true
                , limit: 20
                , limits: [20, 40, 60, 100]
                , where: {
                    action: "listAdmin",
                }
                , cols: [[ //表头
                    {field: 'index', title: '序号', type: 'numbers', toolbar: "#tableId"}
                    , {field: 'name', title: '账号', width: 120}
                    , {field: 'ctime', title: '注册时间', width: 200, toolbar: "#regesTime"}
                    , {field: 'p', title: '权限', toolbar: "#root"}
                    , {field: 'status', title: '状态', templet: '#switchTpl', unresize: true}
                    , {field: '', toolbar: '#barDemo', title: '操作'}
                ]]
                , done: function (res, curr, count) {
                    if (res.count == 0) {
                        layer.msg("没有符合条件的数据哦");
                    }
                }

            });

            //监听状态的操作
            form.on('switch(statusBox)', function (obj) {
                var active = "";
                if (obj.elem.checked) {
                    active = "active";
                    layer.tips("已开启", obj.othis);
                    updateActive(this.value, active, obj);
                }
                else {
                    layer.tips("已禁用", obj.othis);
                    active = "deactive";
                    updateActive(this.value, active, obj);
                }


            });

            //监听行工具事件
            table.on('tool(teachTable)', function (obj) {
                var data = obj.data //获得当前行数据
                    , layEvent = obj.event; //获得 lay-event 对应的值
                $id = data.id;
                $name = data.name;
                $root = data.p;
                switch (layEvent) {
                    case 'detail':
                        window.open('show_bug.php?id=' + $id, '_blank');
                        break;
                    case 'editPass':
                        editPass($id);
                        break;
                    case 'delAdmin':
                        delAdmin($id, $name);
                        break;
                    case 'editAdmin':
                        editAdmin($id, $name, $root);
                        break;
                }
            });

        });
    }
    //删除管理员
    function delAdmin(id, name) {
        layer.confirm('您确定要删除' + name + '吗？', {}, function () {
            $.ajax({
                type: 'post',
                cache: 'false',
                url: startInter,
                data: {
                    "action": "delAdmin",
                    "userId": id,
                    "name":name
                },
                dataType: 'json',
                success: function (res) {
                    layer.msg(res.msg);
                    table();

                },
                error: function (dat) {
                    layer.msg(dat);
                    return false;
                }
            });

        }, function () {
            layer.msg('删除失败', {icon: 6});
        });

    }
    //新增管理员
    function addAdmin() {
        personWin = layer.open({
            type: 1,
            shade: false,
            area: ['60%', '50%'], //宽高
            title: false, //不显示标题
            content: $('#addAdminBox'),
            cancel: function () {
                document.getElementById("addAdminBox").style.display = "none";
            }
        });
    }
    //刷新
    function refresh() {
        table();
    }
    //新增
    function addNewAdmin() {
        $root = $("input:checkbox[name='platfrom']:checked").map(function (index, elem) {
            return $(elem).val();
        }).get().join(',');
        $account = $("#account").val();
        $pass = $("input[name='pass']").val();
        console.log($pass);
        if ($account.length < 3) {
            layer.msg("账号未填或长度过短哦", {icon: 5});
            return false;
        }
        else if ($pass.length < 6) {
            layer.msg("密码长度不符", {icon: 5});
            return false;
        }
        else if ($root == "") {
            layer.msg("未选择用户的管理权限", {icon: 5});
            return false;
        }
        else {
            $root = $root.split(",");
            for ($j = 0; $j < $root.length; $j++) {
                rootArray[$root[$j]] = 1;
            }
            rootArray = rootArray.join(",");
            $pass = $.md5($pass);
            $.ajax({
                type: 'post',
                cache: 'false',
                url: startInter,
                data: {
                    "action": "addAdmin",
                    "username": $account,
                    "password": $pass,
                    "p": rootArray,
                },
                dataType: 'json',
                success: function (res) {
                    layer.msg(res.msg);
                    if (res.code == 0) {
                        window.location.reload();
                    }
                },
                error: function (res) {
                    console.log(res);
                }


            });
        }

    }
    //编辑管理员
    function editAdmin(id, name, p) {
        $("#adminRoot").children().remove();
        editId = id;
        var edit = layer.open({
            type: 1,
            shade: false,
            area: ['60%', '50%'], //宽高
            title: false, //不显示标题
            content: $('#editAdmin'),
            cancel: function () {
                document.getElementById("editAdmin").style.display = "none";
            }
        });
        layui.use(['form'], function () {
            var form = layui.form
                , layer = layui.layer;

            //表单初始赋值
            form.val('editAdmin', {
                "adminName": name
            });
            $platArray = new Array('资源汇集与管理', '云教育服务', '智能分析', '教师管理');
            $root = new Array();
            $root = p.split(",");
            for ($i = 0; $i < $platArray.length; $i++) {
                $rootName = $platArray[$i];
                if ($root[$i] == "1") {
                    $li = $(" <input type=\"checkbox\" checked name=\"editP\" value=\"" + $i + "\" title=\"" + $rootName + "\" >");
                }
                else {
                    $li = $(" <input type=\"checkbox\" name=\"editP\" value=\"" + $i + "\" title=\"" + $rootName + "\" >");
                }

                $("#adminRoot").append($li);
            }
            form.render();
        });


    }
    //编辑密码
    function editPass(id) {
        layer.confirm('确定需要重置密码吗？', {
            btn: ['确定', '取消'] //按钮
        }, function () {
            $.ajax({
                type: "post",
                cache: "false",
                url: startInter,
                data: {
                    "action": "resetPwd",
                    "adminId": id,

                },
                dataType: "json",
                success: function (res) {

                    if (res.code == 0) {
                        layer.msg("密码：" + res.password, {
                            time: false, //20s后自动关闭
                            btn: ['记住了']
                        });
                    }
                    else {
                        layer.msg(res.msg);
                    }


                }, error: function (res) {
                    layer.msg("修改失败");
                }
            });
        }, function () {

        });
    }
    //修改提交
    function sumbitAdmin() {
        $name = $("#adminName").val();
        $rootP = $("input:checkbox[name='editP']:checked").map(function (index, elem) {
            return $(elem).val();
        }).get().join(',');

        if ($name.length < 3) {
            layer.msg("账号未填或长度过短哦", {icon: 5});
            return false;
        }
        else if ($rootP == "") {
            layer.msg("未选择用户的管理权限", {icon: 5});
            return false;
        }
        else {
            $rootP = $rootP.split(",");
            for ($j = 0; $j < $rootP.length; $j++) {
                rootArray[$rootP[$j]] = 1;
            }
            rootArray = rootArray.join(",");
            console.log(rootArray);
            $.ajax({
                type: 'post',
                cache: 'false',
                url: startInter,
                data: {
                    "action": "editUser",
                    "username": $name,
                    "p": rootArray,
                    "adminId": editId,
                },
                dataType: 'json',
                success: function (res) {
                    layer.msg(res.msg);
                    if (res.code == 0) {
                        window.location.reload();
                    }
                },
                error: function (dat) {
                    layer.msg(dat);
                    return false;

                }


            });
        }

    }
    //管理员权限
    function rootP(val,id) {
        val = val.split(",");
        var rootTitle = [];
        var id="R"+id;

        if (val[0] == "1") {
            rootTitle.push("资源汇集与管理");
        }
        if (val[1] == "1") {
            rootTitle.push("云教育服务");
        }
        if (val[2] == "1") {
            rootTitle.push("智能分析");
        }
        if (val[3] == "1") {
            rootTitle.push("教师管理");
        }
        return rootTitle;
    }
    //状态修改
    function updateActive(id, val, obj) {
        $.ajax({
            type: "post",
            url: startInter,
            data: {
                "action": "activeAdmin",
                "adminId": id,
                "active": val,
            },
            dataType: "json",
            success: function (res) {
                if (res.code != 0) {
                    layer.tips(res.msg, obj.othis);
                }
            },
            error: function (res) {
                layer.tips("操作失败", obj.othis);
                window.location.reload();
            }
        });
    }
</script>
<!--//注册时间-->
<script type="text/html" id="regesTime">
    {{#  if(d.ctime !=undefined){ }}
    <a style="color: #787878" class="layui-table-link">{{to_date(d.ctime)}}</a>
    {{#  } }}
</script>
<!--//权限-->
<script type="text/html" id="root" style="height: 200px">
    <ul  class="root_nav">



        {{#  for(var i=0;i<rootP(d.p,d.id).length;i++){ }}
        {{#  if( rootP(d.p,d.id)[i]=="资源汇集与管理"){ }}
        <li><a class=" layui-btn layui-btn-xs layui-btn-primary"> {{rootP(d.p,d.id)[i]}}</a></li>
        {{#  } }}
        {{#  if( rootP(d.p,d.id)[i]=="云教育服务"){ }}
        <li><a class=" layui-btn layui-btn-xs "> {{rootP(d.p,d.id)[i]}}</a></li>
        {{#  } }}
        {{#  if( rootP(d.p,d.id)[i]=="智能分析"){ }}
        <li><a class=" layui-btn layui-btn-xs layui-btn-normal"> {{rootP(d.p,d.id)[i]}}</a></li>
        {{#  } }}
        {{#  if( rootP(d.p,d.id)[i]=="教师管理"){ }}
        <li><a class=" layui-btn layui-btn-xs layui-btn-warm"> {{rootP(d.p,d.id)[i]}}</a></li>
        {{#  } }}
        {{#  } }}
        </ul>
</script>
<!--//状态显示-->
<script type="text/html" id="statusBar">
    {{#  if(d.status =="1"){ }}
    <a style="color:#009688" class="layui-table-link">可登陆</a>
    {{#  } }}
    {{#  if(d.status =="0"){ }}
    <a style="color: #787878" class="layui-table-link">不可登陆</a>
    {{#  } }}
</script>

<script type="text/html" id="barDemo">

<?php
if($power==1){
    echo "{{#  if(d.power!=1){ }}
    <a class=\"layui-btn layui-btn-xs layui-btn-primary\" lay-event=\"editAdmin\"><i class=\"layui-icon\">&#xe642;</i>修改</a>
    <a class=\"layui-btn layui-btn-xs layui-btn-primary\" lay-event=\"delAdmin\"><span class=\"icon iconfont\">&#xe606;</span>删除</a>
    {{#  } }}
       <a class=\"layui-btn layui-btn-xs layui-btn-primary\" lay-event=\"editPass\"><i class=\"layui-icon\">&#xe642;</i>重置密码</a>
    ";

}
else{
    echo "<a style=\"color: #787878\" class=\"layui-table-link\">不可操作</a>";
}


?>





</script>

<div class="layui-content" style="display: none" id="editAdmin">
    <div class="layui-card-header">编辑管理员</div>
    <form class="layui-form layui-card-body" lay-filter="editAdmin">

        <div class="layui-form-item">
            <label class="layui-form-label">账号：</label>
            <div class="layui-input-inline">
                <input name="adminName" class="layui-input" type="text" placeholder="请输入账号" autocomplete="off"
                       lay-verify="adminName" id="adminName">
            </div>
            <div class="layui-form-mid layui-word-aux" id="accountMsg">
            </div>
        </div>

        <div class="layui-form-item">
            <label class="layui-form-label">管理权限：</label>
            <div class="layui-input-block" id="adminRoot">
            </div>
        </div>


    </form>
    <div class="layui-form-item">
        <div class="layui-input-block" style="float: right;right: 50px">
            <a class="layui-btn layui-btn-blue" id="editAdmin" onclick="sumbitAdmin()">立即修改</a>
        </div>
    </div>
</div>
